/**
 * @class Ext.app.DanhSachMatHangPanel
 * @extends Ext.panel.Panel
 */
Ext.require([
    'Ext.app.ThemMatHangWindow'
]);
            
Ext.define('Ext.app.DanhSachMatHangPanel', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.danhSachMatHangPanel',
    autoScroll: true,
    border: true,
    layout: 'border',
    titleAlign: 'center',
    items: [
        {
            region: 'center',
            xtype: 'gridpanel',
            columnLines: true,
            store: {
                fields: ['prodPK', 'code', 'madeIn', 'nameBySupplier', 'nameForSell', 'type'],
                pageSize: 25,
                proxy: {
                    type: 'ajax',
                    url: 'DanhSachMatHang.jsp',
                    reader: {
                        type: 'json',
                        root: 'root',
                        totalProperty: 'totalCount'
                    }
                }
            },
            columns: [/*{ 
                sortable: false,
                draggable: false,
                menuDisabled: true,
                width: 30,
                align: 'center',
                resizable: false,
                renderer: Ext.renderPopupIcon
            },*/{
                text: this.translations.get("HOME.PRODUCT_CODE"),
                draggable: false,
                menuDisabled: true,
                dataIndex: 'code',
                width: 150
            },{
                text: this.translations.get("HOME.PRODUCT_NAME_BY_SUPPLIER"),
                draggable: false,
                menuDisabled: true,
                dataIndex: 'nameBySupplier',
                width: 300
            },{
                text: this.translations.get("HOME.PRODUCT_NAME_FOR_SELL"),
                draggable: false,
                menuDisabled: true,
                dataIndex: 'nameForSell',
                flex: 1
            },{
                text: this.translations.get("HOME.XUAT_XU"),
                draggable: false,
                menuDisabled: true,
                dataIndex: 'madeIn',
                width: 150
            },{
                text: this.translations.get("HOME.LOAI_HANG_HOA"),
                draggable: false,
                menuDisabled: true,
                dataIndex: 'type',
                width: 150
            }],
            viewConfig: {
                loadingText: this.translations.get("HOME.PLEASE_WAIT"),
                stripeRows: true
            },
            tbar: [{
                icon: 'images/add.png',
                handler: function(button) {
                    var wind = Ext.create('widget.themMatHangWindow', {
                        title: translations.get('HOME.THEM_MAT_HANG')
                    });
                    wind.setOpener(button.up('gridpanel'));
                    wind.show();
                }
            }],
            listeners: {
                cellclickx: function(table, td, cellIndex, record, tr, rowIndex, e, eOpts) {
                    if(cellIndex == 0 && td.innerHTML.indexOf("popupmenu") != -1) {
                        var items = [
                            {
                                text: translations.get("HOME.CHINH_SUA"),
                                icon:"images/edititem.gif",
                                table: table,
                                handler: function(menu) {
                                    var wind = Ext.create('widget.themMatHangWindow', {
                                        title: translations.get('HOME.THEM_MAT_HANG')
                                    });
                                    wind.setOpener(menu.table.up('gridpanel'));
                                    wind.setData({
                                        'prodPK': record.get("prodPK"),
                                        'code': record.get("code"),
                                        'madeIn': record.get("madeIn"),
                                        'nameBySupplier': record.get("nameBySupplier"),
                                        'nameForSell': record.get("nameForSell"),
                                        'type': record.get("type")
                                    });
                                    wind.show();
                                }
                            }
                        ];
                        openPopupMenu(e, items);
                    }
                }
            },
            afterFirstLayout: function() {
                // paging bar on the bottom [
                var bbar = Ext.create('Ext.PagingToolbar', {
                    store: this.getStore(),
                    beforePageText: 'Trang',
                    afterPageText: '/ {0}'
                });
                bbar.dock = "bottom";
                this.addDocked(bbar);
                //]
                this.getStore().load();
            },
            
            reload: function() {
                this.getStore().load();
            }
        },
    ]
});
